<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link href="style/editor.css" rel="stylesheet" type="text/css">
    <script>
  var sLangDir=parent.oUtil.langDir;
  document.write("<scr"+"ipt src='language/"+sLangDir+"/table_format.js'></scr"+"ipt>");

    </script>
    <script>writeTitle()</script>
    <script>

function GetElement(oElement,sMatchTag)
  {
  while (oElement!=null&&oElement.tagName!=sMatchTag)
    {
    if(oElement.tagName=="BODY")return null;
    oElement=oElement.parentElement;
    }
  return oElement;
  }

function doWindowFocus() {
  parent.oUtil.onSelectionChanged=new Function("realTime()");
}

function bodyOnLoad() {
  loadTxt();

  window.onfocus=doWindowFocus;
  parent.oUtil.onSelectionChanged=new Function("realTime()");

  realTime();
}

function bodyOnUnload() {
  parent.oUtil.onSelectionChanged=null;
}

function realTime() {

}

function applyFormat(sName) {

	var edtObj = parent.oUtil.obj;

	edtObj.setFocus();
	if(!edtObj.checkFocus()){return;}//Focus stuff

	edtObj.saveForUndo(); /*undo/redo*/

	var oEditor=parent.oUtil.oEditor;
  	var oSel=oEditor.document.selection.createRange();
  	var sType=oEditor.document.selection.type;

    var oTD = (oSel.parentElement != null ? GetElement(oSel.parentElement(), "TD") : GetElement(oSel.item(0), "TD"));
    var oTR = (oSel.parentElement != null ? GetElement(oSel.parentElement(), "TR") : GetElement(oSel.item(0), "TR"));
    var oTable = (oSel.parentElement != null ? GetElement(oSel.parentElement(), "TABLE") : GetElement(oSel.item(0), "TABLE"));

	if(oTD == null) return;

	var sTableClass = sName;
	var sCellClass = "";
	var sAltCellClass = "alt";
	var sHeaderRowClass = "hd";
	var sFirstCellClass = "fc";
	var sAltFirstCellClass = "fcalt";

	oTable.className = sTableClass;
	var bIsAlternate = false;
	var sCell;
	var sFirstCell;
	for (var i = 0; i < oTable.rows.length; i++) {
		var oTR_tmp = oTable.rows[i];
		if (bIsAlternate) {
			sCell = sAltCellClass;
			sFirstCell = sAltFirstCellClass;
			bIsAlternate = false;
		}
		else {
			sCell = sCellClass;
			sFirstCell = sFirstCellClass;
			bIsAlternate = true;
		}
		for (var j = 0; j < oTR_tmp.cells.length; j++) {
			if (j == 0) oTR_tmp.cells[j].className = sFirstCell; /*first column*/
			if (i == 0) oTR_tmp.cells[j].className = sHeaderRowClass; /*header row*/
			if (i != 0 && j != 0) oTR_tmp.cells[j].className = sCell;
		}
	}

}

function doClick(oEl) {
    var oParent = oEl.parentNode;
    for (i = 0; i < oParent.childNodes.length; i++) {
        if (oParent.childNodes[i].tagName == 'DIV') {
            oParent.childNodes[i].rel = '';
            oParent.childNodes[i].style.backgroundColor = '#ccc';
            oParent.childNodes[i].style.color = '#333';
        }
    }
    oEl.rel = 'selected';
    oEl.style.backgroundColor = '#444'; oEl.style.color = '#eee';
}

function windowClose() {
  parent.oUtil.onSelectionChanged=null;
  self.closeWin();
};


    </script>
</head>
<body style="overflow:hidden;">

<table width=100% height=100% align=center cellpadding=0 cellspacing=0>
    <tr>
        <td valign=top style="padding:5;height:100%">

            <table cellpadding=2 cellspacing=0>
                <tr>
                    <td width="90px" nowrap valign="top"><span id="txtLang" name="txtLang">Select format</span>:&nbsp;&nbsp;
                    </td>
                    <td colspan="4" width="100%" valign="top">
                        <table cellpadding="0" cellspacing="0" width="100%" id="Table2">
                            <tr>
                                <td width="100%">

                                    <div unselectable="on"
                                         style="width:200px;height:130px;border:#ccc 1px solid;background:#ccc;overflow-x:hidden;overflow-y:scroll;">
                                        <div unselectable="on" onmousedown="doClick(this);applyFormat('Default');"
                                             style="cursor:default;font-family:verdana;font-size:9pt;color:#333;">
                                            Default
                                        </div>
                                        <div unselectable="on" onmousedown="doClick(this);applyFormat('Zebra');"
                                             style="cursor:default;font-family:verdana;font-size:9pt;color:#333;">Zebra
                                        </div>
                                        <div unselectable="on" onmousedown="doClick(this);applyFormat('Zebra-2');"
                                             style="cursor:default;font-family:verdana;font-size:9pt;color:#333;">
                                            Zebra-2
                                        </div>
                                        <div unselectable="on" onmousedown="doClick(this);applyFormat('Zebra-3');"
                                             style="cursor:default;font-family:verdana;font-size:9pt;color:#333;">
                                            Zebra-3
                                        </div>
                                        <div unselectable="on"
                                             onmousedown="doClick(this);applyFormat('Vertical-Emphasis');"
                                             style="cursor:default;font-family:verdana;font-size:9pt;color:#333;">
                                            Vertical-Emphasis
                                        </div>
                                        <div unselectable="on"
                                             onmousedown="doClick(this);applyFormat('Vertical-Emphasis-2');"
                                             style="cursor:default;font-family:verdana;font-size:9pt;color:#333;">
                                            Vertical-Emphasis-2
                                        </div>
                                        <div unselectable="on"
                                             onmousedown="doClick(this);applyFormat('Vertical-Emphasis-3');"
                                             style="cursor:default;font-family:verdana;font-size:9pt;color:#333;">
                                            Vertical-Emphasis-3
                                        </div>
                                        <div unselectable="on" onmousedown="doClick(this);applyFormat('Modern');"
                                             style="cursor:default;font-family:verdana;font-size:9pt;color:#333;">Modern
                                        </div>
                                        <div unselectable="on" onmousedown="doClick(this);applyFormat('Modern-Dark');"
                                             style="cursor:default;font-family:verdana;font-size:9pt;color:#333;">
                                            Modern-Dark
                                        </div>
                                    </div>

                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>

        </td>
    </tr>
    <tr>
        <td class="dialogFooter" align="right">
            <table cellpadding=0 cellspacing=0>
                <tr>
                    <td>
                        <input type="button" name="btnClose" id="btnClose" value="close" onclick="windowClose()"
                               class="inpBtn" onmouseover="this.className='inpBtnOver';"
                               onmouseout="this.className='inpBtnOut'">
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

</body>
</html>